import { type Ref, ref, onMounted } from "vue"
import type { IBanner, IGoods } from "@/types/type"
import { RequestBanner, RequestShopList } from "@/apis/index"
import { useRouter } from "vue-router"//从路由对象中引入useRouter

// 搜索跳转
const router = useRouter()
export const useSearch = () => {
    const onSearch = () => {
        router.push('/search') //跳转到搜索页面
    }
    return { onSearch }
}
/*轮播*/

export const useBanner = () => {
    const bannerList: Ref<Array<IBanner>> = ref([])
    /*轮播接口获取数据*/
    const getBanner = async () => {
        const data = await RequestBanner()
        const { resultCode, resultInfo } = data
        if (resultCode === 1) {
            bannerList.value = resultInfo.list
        }
    }
    onMounted(() => {
        getBanner()
    })
    return { bannerList, getBanner }
}

/*商品列表显示及刷新
 *   商品列表显示
 *   加载更多
 *   下拉刷新*/
export const useGoods = (getBanner: Function) => {
    const loading: Ref<boolean> = ref(false)// 加载数据状态，true表示加载中,false加载完成
    const finished: Ref<boolean> = ref(false)// 加载完成数据状态, 所有数据加载完成设置为true
    const list: Ref<Array<IGoods>> = ref([]) //ref()返回ref对象的数据类型是Ref
    const refreshLoading: Ref<boolean> = ref(false) // 下拉刷新状态，true刷新中，false是未刷新
    let currentNo: number = 1// 当前页号
    /*加载更多
    * 1.第一次进入自动调用,loading设置为true
    * 2.触底自动调用
    */
    const onLoad = () => {
        getProductList(currentNo++, 10)
    }
    /*商品列表接口渲染数据---商品列表 pageNo页号，pageSize页大小*/
    const getProductList = async (pageNo: number, pageSize: number) => {
        const data = await RequestShopList(pageNo, pageSize)
        // 关闭下拉刷新, 手动下拉刷新时自动设置为true
        if (refreshLoading.value) {
            list.value = []
            refreshLoading.value = false
        }
        const { resultCode, resultInfo } = data
        if (resultCode === 1) {
            list.value = [...list.value, ...resultInfo.list]
        }
        loading.value = false // loadding加载完成|关闭下拉刷新
        if (resultCode === -1) {
            finished.value = true //resultCode为-1时，说明所有数据加载完成，将finished置为true
        }
    }

    return { loading, finished, refreshLoading, list, onLoad, getProductList }
}
/*商品详情*/
export const useGoodsDetail = () => {
    const router = useRouter()//定义router
    const bindGoodsDetail = (id: number) => {
        router.push({ path: "/detail", query: { id } })//调用路由对象；接收绑定的唯一ID，然后路由传参给detail
    }
    return { bindGoodsDetail }
}

// 首页添加数据至购物车
import { Toast } from 'vant';
import type { ICartGoods } from "../types/type"
import { useCartStore } from "@/stores/cart";
import { useDetail } from "@/hooks/detail"
export const AddCart = () => {
    const { goods } = useDetail()
    const cartStore = useCartStore()
    const cartGoods: ICartGoods = {
        id: goods.value.id,//添加商品时的id
        name: goods.value.product,
        price: goods.value.price,
        url: goods.value.picture,
        num: 1,//加入购物车，默认数量是1
        state: false,
    }
    cartStore.saveGoods(cartGoods)
    console.log("cartGoods", cartGoods)
    Toast.success('加入购物车成功!')
}
